<template>
    <div className="fixed-table">
        <el-table
                :data="tableData"
                fit
                empty-text="暂无数据"
                style="width: 100%"
        >
            <el-table-column
                    prop="pname"
                    label="职位名称"
                    align="center"
                    header-align="center">
            </el-table-column>
            <el-table-column
                prop="resumeNum"
                label="收到简历数"
                align="center"
                header-align="center">
                <template slot-scope="scope">
                    <el-button type="text" @click="handleRouteResume(scope.$index, scope.row)">
                        {{scope.row.resumeNum}}
                    </el-button>
                </template>
            </el-table-column>
            <el-table-column
                    prop="successNum"
                    label="成功入职数"
                    align="center"
                    header-align="center">
            </el-table-column>
            <el-table-column
                    prop="company"
                    label="公司名称"
                    align="center"
                    header-align="center">
                <template slot-scope="scope">
                    <span v-if="scope.row.company">{{scope.row.company}}</span>
                    <span v-else style="color:#999">未知公司</span>
                </template>
            </el-table-column>

            <el-table-column
                    prop="city"
                    label="城市"
                    align="center"
                    header-align="center"
            >
                <template slot-scope="scope">
                    <span v-if="City.city_list[scope.row.city]===undefined" style="color:#999">未知城市</span>
                    <span v-else>{{City.city_list[scope.row.city]}}</span>
                </template>
            </el-table-column>
            <el-table-column
                    prop="salaryMin"
                    label="最低工资(万)"
                    align="center"
                    header-align="center">
            </el-table-column>
            <el-table-column
                    prop="salaryMax"
                    label="最高工资(万)"
                    align="center"
                    header-align="center">
            </el-table-column>
            <el-table-column
                    prop="payment"
                    label="伯乐奖金(元)"
                    align="center"
                    header-align="center">
            </el-table-column>
            <el-table-column
                    prop="pubtime"
                    label="发布时间"
                    align="center"
                    sortable
                    header-align="center">
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="状态"
                    header-align="center"
                    align="center"
                    filter-placement="bottom-end"
            >
                <template slot-scope="scope">
                    <el-tag
                            :type="statusList[scope.row.status].type"
                            close-transition>{{statusList[scope.row.status].value}}
                    </el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="180" fixed="right">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            type="success"
                            @click="handleEdit(scope.$index, scope.row)">编辑
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            @click="handleDelete(scope.$index, scope.row)">删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <br/>
        <el-row type="flex" justify="center">
            <el-pagination
                    style="align-self:center"
                    background
                    layout="prev, pager, next"
                    :current-page="currentPage"
                    :page-count="totalPage"
                    @current-change="changePage">
            </el-pagination>
        </el-row>
    </div>
</template>

<script>
    import BasicContainer from '@vue-materials/basic-container'
    import Config from '@myconfig/config.min.js'
    import City from '@myconfig/city.min.js'
    import axios from 'axios'

    export default {
        components: {BasicContainer},
        name: 'FixedTable',

        data() {
            return {
                currentPage: 1,
                totalPage: 10,
                tableData: [],
                City: City,
                statusList: [{type: '', value: '待审核'}, {type: 'success', value: '审核完毕'}, {
                    type: 'info',
                    value: '已关闭'
                }, {type: 'info', value: '已删除'}, {type: 'danger', value: '审核不通过'}],
                routeLietouId: ''
            }
        },
        components: {},
        methods: {

            handleEdit(index, row) {
                let _this = this;
                axios({
                    method: 'get',
                    url: Config.baseUrl + "/api/user/now",
                }).then(function (response) {
                    if (response.data.code == 1) {
                        console.log(response.data.data.role);
                        if (response.data.data.role == 3) {
                            _this.$message({
                                type: 'error',
                                message: '管理员不能编辑!'
                            });
                        }
                        else {
                            _this.$router.push({path: '/editPosition/' + row.id})
                        }
                    }
                })

            },
            handleDelete(index, row) {
                // console.log(index, row);
                this.$confirm('此操作将永久删除该记录, 是否继续?', '警告', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$http.post(Config.baseUrl + '/api/position/delete/' + row.id).then(
                        function (rsp) {
                            if (rsp.data.code == 1) {
                                this.$message({
                                    type: 'success',
                                    message: '删除成功!'
                                });
                                this.getData(this.currentPage)
                            } else {
                                this.$message({
                                    type: 'info',
                                    message: '删除失败!' + rsp.data.message
                                });
                            }
                        }
                    )

                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '操作取消'
                    });
                });
            },
            getData(currentPage) {
                console.log(this.$route.params.routeParam1 );
                if (this.$route.params.routeParam1 === undefined) {
                    this.routeLietouId = "";
                } else {
                    this.routeLietouId = this.$route.params.routeParam1;
                }
                this.$http.get(Config.baseUrl + '/api/positions/lietou/' + this.routeLietouId + currentPage).then(function (rsp) {
                    this.tableData = rsp.data.list
                    this.totalPage = rsp.data.pages
                }, function (error) {
                    console.log('====================================');
                    console.log(error);
                    console.log('====================================');
                })
            },
            changePage: function (currentPage) {
                console.log('====================================');
                console.log('pageÇhange new Page' + currentPage);
                console.log('====================================');
                this.getData(currentPage)
            },
            handleRouteResume(index, row) {
                this.$router.push({
                    path: '/lietouManage',
                    name: 'lietouManage',
                    component: 'Lietous',
                    params: {
                        positionParam1: 'position/',
                        positionParam2: row.id + '/',
                    }
                })
            }
        },
        created() {
            console.log('====================================');
            console.log('created');
            console.log('====================================');
            this.getData(1)
        },
        mounted() {
            console.log('====================================');
            console.log('mounted');
            console.log('====================================');
        }
    }
</script>

<style>
    .fixed-table {

    }
</style>
